@import '../base/config.less';

.@{name}-index {
	
	& &-banner {
		.swiper-slide {
			height: rem(666);
			background: @main;

			img {
				display: block;
				width: 100%;
				height: 100%;
			}
		}

		.swiper-pagination-bullet {
			background: #fff;
			opacity: 1;
			width: rem(16);
			height: rem(16);
			transition: all .3s;
		}
		.swiper-pagination-bullet-active {
			width: rem(52);
			border-radius: rem(8);
		}
	}

	& &-menu {
		display: flex;
		align-items: center;
		padding: rem(7) 0 rem(12);

		a {
			flex: 1;
			color: #6c6c6c;
			font-size: rem(30);
			text-align: center;

			&:nth-child(odd) {
				padding-right: rem(4);
			}

			&:nth-child(even) {
				padding-left: rem(4);
			}

			&:nth-child(3) {
				padding-left: rem(8);
				padding-right: 0;
			}

			img {
				display: block;
				height: rem(220);
				margin-bottom: rem(12);
			}
		}
	}

}